/**
* Created by yyr on 2018/2/8首页
*/
<template>
    <div>
        <!--右开始-->
        <div class="right">
            <el-row  class="ca-m-t-5" :gutter="15">
                <el-col :span="12">
                    <div class="ca-title">
                        <h3>我的任务</h3>
                        <div class="clear"></div>
                    </div>
                    <div class="index-box-01 ca-p-22 ca-m-t-5">
                        <el-row :gutter="15">
                            <el-col :span="8"><div @click="personalCenter(0)" class="cursor ca-font-size-18 color-gray ca-vertical-align-middle">逾期任务：<span class="ca-color-index-blue ca-font-size-22">{{myMissionList.overdueConut}}</span><span class="ca-font-size-14">个</span></div></el-col>
                            <el-col :span="8"><div @click="personalCenter(0)" class="cursor ca-font-size-18 color-gray ca-vertical-align-middle">未完成任务：<span class="ca-color-index-blue ca-font-size-22">{{myMissionList.notCompleteCount}}</span><span class="ca-font-size-14">个</span></div></el-col>
                        </el-row>
                    </div>
                </el-col>
                <el-col :span="12">
                    <div class="ca-title">
                        <h3>我的审批</h3>
                        <div class="clear"></div>
                    </div>
                    <div class="index-box-01 ca-p-22 ca-m-t-5">
                        <el-row :gutter="15" v-if="myMissionFlag">
                            <el-col :span="8"><div @click="personalCenter(1)" class="cursor ca-font-size-18 color-gray ca-vertical-align-middle">待我审批：<span class="ca-color-index-blue ca-font-size-22">{{myMissionList.needMeApprovalCount }}</span><span class="ca-font-size-14">个</span></div></el-col>
                            <el-col :span="8"><div @click="personalCenter(2)" class="cursor ca-font-size-18 color-gray ca-vertical-align-middle">我发起的：<span class="ca-color-index-blue ca-font-size-22">{{myMissionList.meLaunchApprovalCount}}</span><span class="ca-font-size-14">个</span></div></el-col>
                        </el-row>
                    </div>
                </el-col>
            </el-row>
            <div class="ca-title ca-m-t-20">
                <h3>整体概况</h3>
                <div class="clear"></div>
            </div>
            <el-row class="ca-m-t-5 index-box-01">
                <el-col :span="6" style="border-right:#dbe3ea 1px solid;" class="ca-align-center">
                    <h3 >上月 / 本年新募集基金</h3>
                    <el-row :span="12" class="line-30"><i>数量(个)</i><span>{{raiseFund.lastMonthNum}}/{{raiseFund.currentYearNum}}</span></el-row>
                    <el-row :span="12" class="line-30"><i>总金额(亿元)</i><span class="s_01">{{raiseFund.lastMonthSum | format1}}/{{raiseFund.currentYearSum | format1}}</span></el-row>
                </el-col>
                <el-col :span="6" class="ca-align-center" style="border-right:#dbe3ea 1px solid;">
                   <h3>上月 / 本年新投资项目</h3>
                   <el-row :span="12" class="line-30"><i>数量(个)</i><span>{{investProject.lastMonthNum}}/{{investProject.currentYearNum}}</span></el-row>
                   <el-row :span="12" class="line-30"><i>总金额(亿元)</i><span class="s_01">{{investProject.lastMonthSum | format1}}/{{investProject.currentYearSum | format1}}</span></el-row>
                </el-col>
                <el-col :span="6" class="ca-align-center" style="border-right:#dbe3ea 1px solid;">
                    <h3>上月 / 本年退出项目</h3>
                    <el-row :span="12" class="line-30"><i>数量(个)</i><span>{{quitProject.lastMonthNum}}/{{quitProject.currentYearNum}}</span></el-row>
                    <el-row :span="12" class="line-30"><i>总金额(亿元)</i><span class="s_01">{{quitProject.lastMonthSum | format1}}/{{quitProject.currentYearSum | format1}}</span></el-row>
                </el-col>
                <el-col :span="6" class="ca-align-center">
                    <h3>拟投资 / 拟设立</h3>
                    <el-row :span="12" class="line-30"><i>项目(个)</i><span>{{planList.itemNum}}</span></el-row>
                    <el-row :span="12" class="line-30"><i>基金(支)</i><span class="s_01">{{planList.fundNum}}</span></el-row>
                </el-col>
            </el-row>
            <div class="ca-title ca-m-t-20">
                <h3>投前动态</h3>
                <div class="clear"></div>
            </div>
            <div class="index-box-01" style="padding:40px 20px;">
                <div class="ca-bef-left">
                    本月<br />
                    本年
                </div>
                <div class="ca-bef-bxo">
                    <div class="bef-border"></div>
                    <div class="ca-bef-rigth">
                        <div class="ca_width_percent_20" v-for="(item,index) in preCast">
                            <div class="ca-bef-con" :class="'ca-bef-con_0'+ index">
                                <div class="ca_width_percent_60">{{item.currentMonth}}<br />{{item.currentYear}}</div>
                            </div>
                            <div class="ca-bef-center">{{item.nodeValue | getNameById('quasiNode')}}</div>
                        </div>
                        <div class="clear"></div>
                    </div>
                </div>
            </div>
            <!--基金整体表现-->
            <div class="ca-title ca-m-t-20">
                <h3>基金整体表现</h3>
                <div class="clear"></div>
            </div>
            <div class="index-tab-title-01">
                <ul>
                    <li @click="wholeFund(0)" :class="{on:wholeFundTabIndex==0||wholeFundTabIndex==4}">
                        累积基金总规模(万元)
                        <span>{{fundTotal.fundScale | format1}}</span>
                    </li>
                    <li @click="wholeFund(1)" :class="{on:wholeFundTabIndex==1||wholeFundTabIndex==5}">
                        累积基金总数量(支)
                        <span>{{fundTotal.fundNum}}</span>
                    </li>
                    <li @click="wholeFund(2)" :class="{on:wholeFundTabIndex==2||wholeFundTabIndex==6}">
                        累计总投资金额(万元)
                        <span>{{fundTotal.fundInvestment | format1}}</span>
                    </li>
                    <li @click="wholeFund(3)" :class="{on:wholeFundTabIndex==3}" style="border-right:none">
                        当前基金投资余额(万元)
                        <span>{{fundTotal.fundBalance | format1}}</span>
                    </li>
                </ul>
            </div>
            <div class="index-tab-box-01">
                <div class="index-div-01" style="height:0px;overflow:hidden;width:100%;" :style="{'height':wholeFundTabIndex===0||wholeFundTabIndex===4 ? 'auto':0+'px'}">
                    <div class="e-btn">
                        <a class="btn" :class="{on:wholeFundTabIndex === 0}" @click="wholeFund(0)">年</a>
                        <a class="btn" :class="{on:wholeFundTabIndex === 4}" @click="wholeFund(4)">月</a>
                    </div>
                    <div class="index-echarts" style="overflow: hidden;height:0px;" :style="{'height':wholeFundTabIndex === 0 ? 'auto':0+'px'}">
                        <div style="width: 100%;height:300px;" ref="wholeFundYear"></div>
                    </div>
                    <div class="index-echarts" style="overflow: hidden;height:0px;" :style="{'height':wholeFundTabIndex === 4 ? 'auto':0+'px'}">
                        <div style="width: 100%;height:300px;" ref="wholeFundMonth"></div>
                    </div>
                </div>
                <div class="index-div-01" style="height:0px;overflow:hidden" :style="{'height':wholeFundTabIndex ===1||wholeFundTabIndex ===5 ? 'auto':0+'px'}">
                    <div class="e-btn">
                        <a class="btn" :class="{on:wholeFundTabIndex==1}" @click="wholeFund(1)">年</a>
                        <a class="btn" :class="{on:wholeFundTabIndex==5}" @click="wholeFund(5)">月</a>
                    </div>
                    <div class="index-echarts" style="overflow: hidden;height:0px;" :style="{'height':wholeFundTabIndex ===1 ? 'auto':0+'px'}">
                        <div style="width: 100%;height:300px;" ref="fundNumYear"></div>
                    </div>
                    <div class="index-echarts" style="overflow: hidden;height:0px;" :style="{'height':wholeFundTabIndex ===5 ? 'auto':0+'px'}">
                        <div style="width: 100%;height:300px;" ref="fundNumMonth"></div>
                    </div>
                </div>
                <div class="index-div-01" style="height:0px;overflow:hidden" :style="{'height':wholeFundTabIndex===2||wholeFundTabIndex===6 ? 'auto':0+'px'}">
                    <div class="e-btn">
                        <a class="btn" :class="{on:wholeFundTabIndex===2}" @click="wholeFund(2)">年</a>
                        <a class="btn" :class="{on:wholeFundTabIndex===6}" @click="wholeFund(6)">月</a>
                    </div>
                    <div class="index-echarts" style="overflow: hidden;height:0px;" :style="{'height':wholeFundTabIndex ===2 ? 'auto':0+'px'}">
                        <div style="width: 100%;height:300px;" ref="fundMoneyYear"></div>
                    </div>
                    <div class="index-echarts" style="overflow: hidden;height:0px;" :style="{'height':wholeFundTabIndex ===6 ? 'auto':0+'px'}">
                        <div style="width: 100%;height:300px;" ref="fundMoneyMonth"></div>
                    </div>
                </div>
                <div class="index-div-01" style="height:0px;overflow:hidden" :style="{'height':wholeFundTabIndex===3 ? 'auto':0+'px'}">
                    <div class="index-echarts">
                        <div style="width:100%;height:300px;" ref="fundBalance"></div>
                    </div>
                </div>
            </div>
            <!--股权项目整体表现-->
            <div class="ca-title ca-m-t-20">
                <h3>股权项目整体表现</h3>
                <div class="clear"></div>
            </div>
            <div class="index-tab-title-01 index-tab-title-02">
                <ul>
                    <li @click="equityProject(0)" :class="{on:equityProjectTabIndex==0||equityProjectTabIndex==3}">
                        累积投资/退出项目(次)
                        <span>{{thighWholeProject.investInCount}}/{{thighWholeProject.investOutCount}}</span>
                    </li>
                    <li @click="equityProject(1)" :class="{on:equityProjectTabIndex==1||equityProjectTabIndex==4}">
                        累积投资/退出金额(万元)
                        <span>{{thighWholeProject.investInAmount | format1}}/{{thighWholeProject.investOutAmount | format1}}</span>
                    </li>
                    <li @click="equityProject(2)" :class="{on:equityProjectTabIndex==2}" style="border-right:none">
                        投资行业分布
                        <span>-</span>
                    </li>
                </ul>
            </div>
            <div class="index-tab-box-01">
                <div class="index-div-01" style="height:0px;overflow:hidden" :style="{'height':equityProjectTabIndex==0||equityProjectTabIndex==3 ? 'auto':0+'px'}">
                    <div class="e-btn">
                        <a class="btn" :class="{on:equityProjectTabIndex==0}" @click="equityProject(0)">年</a>
                        <a class="btn" :class="{on:equityProjectTabIndex==3}" @click="equityProject(3)">月</a>
                    </div>
                    <div class="index-echarts" style="overflow: hidden;height:0px;" :style="{'height':equityProjectTabIndex==0 ? 'auto':0+'px'}">
                        <div style="width: 100%;height:300px;" ref="profitCountYear"></div>
                    </div>
                    <div class="index-echarts" style="overflow: hidden;height:0px;" :style="{'height':equityProjectTabIndex==3 ? 'auto':0+'px'}">
                        <div style="width: 100%;height:300px;" ref="profitCountMonth"></div>
                    </div>
                </div>
                <div class="index-div-01" style="height:0px;overflow:hidden" :style="{'height':equityProjectTabIndex==1||equityProjectTabIndex==4 ? 'auto':0+'px'}">
                    <div class="e-btn">
                        <a class="btn" :class="{on:equityProjectTabIndex==1}" @click="equityProject(1)">年</a>
                        <a class="btn" :class="{on:equityProjectTabIndex==4}" @click="equityProject(4)">月</a>
                    </div>
                    <div class="index-echarts" style="overflow: hidden;height:0px;" :style="{'height':equityProjectTabIndex==1 ? 'auto':0+'px'}">
                        <div style="width: 100%;height:300px;" ref="profitMoneyYear"></div>
                    </div>
                    <div class="index-echarts" style="overflow: hidden;height:0px;" :style="{'height':equityProjectTabIndex==4 ? 'auto':0+'px'}">
                        <div style="width: 100%;height:300px;" ref="profitMoneyMonth"></div>
                    </div>
                </div>
                <div class="index-div-01" style="height:0px;overflow:hidden" :style="{'height':equityProjectTabIndex==2 ? 'auto':0+'px'}">
                    <div style="width: 50%;height:300px;float:left; text-align: center" ref="thightProfitLeft"></div>
                    <div style="width: 50%;height:300px;float:left; text-align: center" ref="thightProfitRight"></div>
                </div>
            </div>
        </div>
    </div>
</template>
<script type="text/ecmascript-6">
    import {api} from './api';
    import {STATUS_HTTP_SUCCESS, apiHttp} from '__service/csHttp';
    import echarts from 'echarts';
    import {isNoAuth} from '__service/utils';
    export default {
        data() {
            return {
                isAuthSee: isNoAuth('我的首页-查看'),
                fundChart: null,
                fundChart2: null,
                fundChart3: null,
                fundChart4: null,
                fundChart5: null,
                fundChart6: null,
                fundChart7: null,
                thightChart: null,
                thightChart2: null,
                thightChart3: null,
                thightChart4: null,
                thightChart5: null,
                thightChart6: null,
                //选项卡初始化索引值
                wholeFundTabIndex: 0,
                equityProjectTabIndex: 0,
                thighWholeProject: {// 股权项目整体表现
                    investInAmount: '',//累计总投资金额(万元)
                    investInCount: '',//累计投资数量,
                    investOutAmount: '',//累计退出金额
                    investOutCount: '',// 累计退出数量
                    investIndustryAmount: [],// 投资项目金额行业分布 key 代表行业 value代表数量
                    investIndustryCount: [],//投资项目数量行业分布 key 代表行业 value代表数量
                    investInCountByYear: [],//投资项目数 年
                    investInCountByMonth: [],//投资项目数 月
                    investInAmountByYear: [],//投资金额 年
                    investInAmountByMonth: [],//投资金额 -月
                    investOutCountByYear: [],//退出项目数 年
                    investOutCountByMonth: [],//退出项目数 月
                    investOutAmountByYear: [],//退出金额 年
                    investOutAmountByMonth: [],//退出金额 月
                },
                fundTotal: [], //头部总统计
                fundMonthScale: {},//第一个图表的年月信息
                fundYearScale: {},//第一个图表的年信息
                fundYearNum: {},//第二个图表年信息
                fundMonthNum: {},//第二个图表月信息
                fundYearMoney: {},//第三个图表年信息
                fundMonthMoney: {},//第三个图表月信息
                fundBalance: [],//第四个图表信息
                fundType: this.$store.state.user.dictionaryMap.fundType,//基金类型
                industry: this.$store.state.user.dictionaryMap.industry, //投资方向
                raiseFund: {},//募集基金数据
                investProject: {},//新投资项目
                quitProject: {},//退出项目
                planList: {},//拟
                myMissionList: {},//我的任务，我的审批
                preCast: [],//投前动态
                myMissionFlag: false,// 任务flag
            }
        },
        mounted() {
        },
        created() {
        },
        updated() {
        },
        beforeRouteEnter(to, from, next) {
            next(vm=>{
                if (!vm.isAuthSee) {
                    vm.$message({
                        message: '没有此页面的操作权限',
                        type: 'error',
                        center: true
                    });
                    vm.$router.replace({name: 'personal-center', params: {tabIndex: '0'}})
                    return;
                }
                vm.myMissionMet(); // 我的任务
                vm.preCastMet();
                vm.generalSurveyMet();
                vm.fundOverallMet()
                vm.thighWholeProjectMet()
            });
        },
        methods: {
            toDetailPage(row) {
                this.$router.push({ name: 'pre-investment-project', params: { itemID: row.itemMap.item_id, tabIndex: 0, openWindow: true } });
            },
            myMissionMet() {//我的任务
                apiHttp(api.MY_APPROVAL).then( ret=>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        if (ret.data) {
                            this.myMissionFlag = true;
                            this.myMissionList.needMeApprovalCount = ret.data.needMeApprovalCount;
                            this.myMissionList.meLaunchApprovalCount = ret.data.meLaunchApprovalCount;
                        }
                    }
                })
                apiHttp(api.GET_TASK).then( ret=>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.myMissionList.overdueConut = ret.data.overdueConut;
                        this.myMissionList.notCompleteCount = ret.data.notCompleteCount;
                    }
                })
            },
            preCastMet() {//投前动态
                apiHttp(api.ITEM_QUASI_SURVEY).then(ret=> {
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.preCast = ret.data;
                    }
                })
            },
            generalSurveyMet() {//整体概况
                apiHttp(api.GET_OVER_ALL).then( ret=>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        const num = 10000;
                        this.raiseFund = ret.data[0];
                        this.raiseFund.lastMonthSum = Number(ret.data[0].lastMonthSum) / num;
                        this.raiseFund.currentYearSum = ret.data[0].currentYearSum / num;
                        this.investProject = ret.data[1]
                        this.investProject.lastMonthSum = Number(this.investProject.lastMonthSum) / num;
                        this.investProject.currentYearSum = Number(this.investProject.currentYearSum) / num;
                        this.quitProject = ret.data[2]
                        this.quitProject.lastMonthSum = Number(this.quitProject.lastMonthSum) / num;
                        this.quitProject.currentYearSum = Number(this.quitProject.currentYearSum) / num;
                        this.planList = ret.data[3]
                    }
                })
            },
            fundOverallMet() {//基金整体
                let colorArr = {'01': '#4876FF', '02': '#f62334', '03': '#E9967A', '04': '#7A378B', '05': '#43CD80', '06': '#B03060', '07': '#008B8B', '08': '#B03060', '09': '#B03060', '10': '#1C86EE'};
                apiHttp(api.GET_FUNDS_TOTAL).then(ret =>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.fundTotal = ret.data;
                    }
                })
                //第一个图表
                apiHttp(api.GET_FUND_SCALES).then(ret =>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.fundMonthScale = ret.data.fundMonthScale;
                        this.fundYearScale = ret.data.fundYearScale;
                        let fundTypeYearArr = [];//01转为基金
                        let fundColor = [];
                        let fundYearData = []; //年的表数据
                        let fundMonthData = []; //年的表数据
                        if (this.fundYearScale.fundType.length > 0) {
                            this.fundType.map( item=>{
                                this.fundYearScale.fundType.map(v=>{
                                    if (v === item.id) {
                                        //年 基金类型
                                        fundColor.push(colorArr[item.id])
                                        fundTypeYearArr.push(item.name)
                                    }
                                })
                            })
                        }
                        this.fundYearScale.fundType.map((v,i) => {
                            fundYearData.push({
                                name: fundTypeYearArr[i],
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                stack: '基金',
                                data: this.fundYearScale.fundNum[i],
                                itemStyle: {
                                    normal: {
                                        color: fundColor[i]
                                    }
                                }
                            })
                            fundMonthData.push({
                                name: fundTypeYearArr[i],
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                stack: '基金',
                                data: this.fundMonthScale.fundNum[i],
                                itemStyle: {
                                    normal: {
                                        color: fundColor[i]
                                    }
                                }
                            })
                        })
                        //基金整体表现基金总规模（年）
                        let wholeFundYearChart = {
                            title: {
                                text: '基金总规模(万元)',
                                x: 'center',
                                textStyle: {
                                    color: '#666'
                                }
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            //图例
                            legend: {
                                data: fundTypeYearArr,
                                bottom: 0
                            },
                            toolbox: {
                                show: false,
                            },
                            dataZoom: [{
                                start: 70,
                                end: 100,
                                bottom: 30
                            }, {
                                type: 'inside',
                            }],
                            //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                            calculable: true,
                            //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                            grid: [{left: '80',right: '80'}],
                            xAxis: [{
                                type: 'category',
                                data: this.fundYearScale.yearX
                            }],
                            yAxis: [{
                                type: 'value',
                                axisTick: {
                                    show: false
                                }
                            }, ],
                            series: fundYearData
                        };
                        //基金整体表现基金总规模（月）
                        let wholeFundMonthChart = {
                            title: {
                                text: '基金总规模(万元)',
                                x: 'center',
                                textStyle: {
                                    color: '#666'
                                }
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            //图例
                            legend: {
                                data: fundTypeYearArr,
                                bottom: 0
                            },
                            dataZoom: [{
                                start: 70,
                                end: 100,
                                bottom: 30
                            }, {
                                type: 'inside',
                            }],
                            toolbox: {
                                show: false,
                            },
                            //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                            calculable: true,
                            //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                            grid: [{left: '80',right: '80'}],
                            xAxis: [{
                                type: 'category',
                                data: this.fundMonthScale.monthX
                            }],
                            yAxis: [{
                                type: 'value',
                                axisTick: {
                                    show: false
                                }
                            }, ],
                            series: fundMonthData
                        };
                        this.$nextTick(()=>{
                            this.fundChart = echarts.init(this.$refs.wholeFundYear).setOption(wholeFundYearChart);
                            this.fundChart2 = echarts.init(this.$refs.wholeFundMonth).setOption(wholeFundMonthChart);
                        })
                    }
                })
                //第二个图表
                apiHttp(api.GET_FUND_NUM).then(ret => {
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.fundYearNum = ret.data.fundYearNum;
                        this.fundMonthNum = ret.data.fundMonthNum;
                        let fundTypeYearArr = [];
                        let fundColor = [];
                        let fundYearData = []; //年的表数据
                        let fundMonthData = []; //年的表数据
                        if (this.fundYearNum.fundType.length > 0) {
                            this.fundType.map( item=>{
                                this.fundYearNum.fundType.map(v=>{
                                    if (v === item.id) {
                                        //年 基金类型
                                        fundColor.push(colorArr[item.id])
                                        fundTypeYearArr.push(item.name)
                                    }
                                })
                            })
                        }
                        this.fundYearNum.fundType.map((v,i) => {
                            fundYearData.push({
                                name: fundTypeYearArr[i],
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                stack: '基金',
                                data: this.fundYearNum.fundNum[i],
                                itemStyle: {
                                    normal: {
                                        color: fundColor[i]
                                    }
                                }
                            })
                            fundMonthData.push({
                                name: fundTypeYearArr[i],
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                stack: '基金',
                                data: this.fundMonthNum.fundNum[i],
                                itemStyle: {
                                    normal: {
                                        color: fundColor[i]
                                    }
                                }
                            })
                        })
                        //累计基金总数量 （年）
                        let fundNumYearChart = {
                            title: {
                                text: '基金总数量',
                                x: 'center',
                                textStyle: {
                                    color: '#666'
                                }
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            //图例
                            legend: {
                                data: fundTypeYearArr,
                                bottom: 0
                            },
                            dataZoom: [{
                                start: 70,
                                end: 100,
                                bottom: 30
                            }, {
                                type: 'inside',
                            }],
                            toolbox: {
                                show: false,
                            },
                            //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                            calculable: true,
                            //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                            grid: [{left: '80',right: '80'}],
                            xAxis: [{
                                type: 'category',
                                data: this.fundYearNum.yearX
                            }],
                            yAxis: [{
                                type: 'value',
                                axisTick: {
                                    show: false
                                }
                            }, ],
                            series: fundYearData
                        };
                        //累计基金总数量 （月）
                       let fundNumMonthChart = {
                            title: {
                                text: '基金总数量',
                                x: 'center',
                                textStyle: {
                                    color: '#666'
                                }
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            //图例
                            legend: {
                                data: fundTypeYearArr,
                                bottom: 0
                            },
                            toolbox: {
                                show: false,
                            },
                           dataZoom: [{
                               start: 70,
                               end: 100,
                               bottom: 30
                           }, {
                               type: 'inside',
                           }],
                            //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                            calculable: true,
                            //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                            grid: [{left: '80',right: '80'}],
                            xAxis: [{
                                type: 'category',
                                data: this.fundMonthNum.monthX
                            }],
                            yAxis: [{
                                type: 'value',
                                axisTick: {
                                    show: false
                                }
                            }, ],
                            series: fundMonthData
                        };
                       this.$nextTick(()=>{
                            this.fundChart3 = echarts.init(this.$refs.fundNumYear).setOption(fundNumYearChart);
                            this.fundChart4 = echarts.init(this.$refs.fundNumMonth).setOption(fundNumMonthChart);
                       })
                    }
                })
                //第三个图表
                apiHttp(api.GET_FUND_INVESTMENT).then(ret => {
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.fundYearMoney = ret.data.fundYearMoney;
                        this.fundMonthMoney = ret.data.fundMonthMoney;
                        if (this.fundYearMoney) {
                            let fundTypeYearArr = [];
                            let fundColor = [];
                            let fundYearData = []; //年的表数据
                            let fundMonthData = []; //月的表数据
                            let fundTypeMonthArr = [];
                            this.fundType.map( item=>{
                                this.fundYearMoney.fundType.map(v=>{
                                    if (v === item.id) {
                                        fundColor.push(colorArr[item.id])
                                        fundTypeYearArr.push(item.name)
                                        fundTypeMonthArr.push(item.name)
                                    }
                                })
                            })
                            for (let i = 0; i < this.fundYearMoney.fundType.length - 1; i++) {
                                fundYearData.push({
                                    name: fundTypeYearArr[i],
                                    type: 'bar',
                                    barWidth: 20, //柱图宽度
                                    stack: '基金',
                                    data: this.fundYearMoney.fundNum[i],
                                    itemStyle: {
                                        normal: {
                                            color: fundColor[i]
                                        }
                                    }
                                })
                                fundMonthData.push({
                                    name: fundTypeMonthArr[i],
                                    type: 'bar',
                                    barWidth: 20, //柱图宽度
                                    stack: '基金',
                                    data: this.fundMonthMoney.fundNum[i],
                                    itemStyle: {
                                        normal: {
                                            color: fundColor[i]
                                        }
                                    }
                                })
                            }
                            fundYearData.push({
                                name: this.fundYearMoney.fundType[this.fundYearMoney.fundType.length - 1],
                                type: 'line',
                                data: this.fundYearMoney.fundNum[this.fundYearMoney.fundNum.length - 1],
                                itemStyle: {
                                    normal: {
                                        color: '#054EAD'
                                    }
                                }
                            })
                            fundMonthData.push({
                                name: this.fundYearMoney.fundType[this.fundYearMoney.fundType.length - 1],
                                type: 'line',
                                data: this.fundMonthMoney.fundNum[this.fundMonthMoney.fundNum.length - 1],
                                itemStyle: {
                                    normal: {
                                        color: '#054EAD'
                                    }
                                }
                            })
                            fundTypeYearArr.push('累计')
                            fundTypeMonthArr.push('累计')
                            //累计基金总数量（年）
                            let fundMoneyYearChart = {
                                title: {
                                    text: '投资总金额（万元）',
                                    x: 'center',
                                    textStyle: {
                                        color: '#666'
                                    }
                                },
                                tooltip: {
                                    trigger: 'axis',
                                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                        type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                    }
                                },
                                //图例
                                legend: {
                                    data: fundTypeYearArr,
                                    bottom: 0
                                },
                                dataZoom: [{
                                    start: 70,
                                    end: 100,
                                    bottom: 30
                                }, {
                                    type: 'inside',
                                }],
                                toolbox: {
                                    show: false,
                                },
                                //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                                calculable: true,
                                //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                                grid: [{left: '80',right: '80'}],
                                xAxis: [{
                                    type: 'category',
                                    data: this.fundYearMoney.yearX
                                }],
                                yAxis: [{
                                    type: 'value',
                                    axisTick: {
                                        show: false
                                    }
                                }, ],
                                series: fundYearData
                            };
                            //累计基金总数量 （月）
                            let fundMoneyMonthChart = {
                                title: {
                                    text: '投资总金额（万元）',
                                    x: 'center',
                                    textStyle: {
                                        color: '#666'
                                    }
                                },
                                tooltip: {
                                    trigger: 'axis',
                                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                        type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                    }
                                },
                                //图例
                                legend: {
                                    data: fundTypeMonthArr,
                                    bottom: 0
                                },
                                toolbox: {
                                    show: false,
                                },
                                //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                                calculable: true,
                                //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                                grid: [{left: '80',right: '80'}],
                                dataZoom: [{
                                    start: 70,
                                    end: 100,
                                    bottom: 30
                                }, {
                                    type: 'inside',
                                }],
                                xAxis: [{
                                    type: 'category',
                                    data: this.fundMonthMoney.monthX
                                }],
                                yAxis: [{
                                    type: 'value',
                                    axisTick: {
                                        show: false
                                    }
                                }, ],
                                series: fundMonthData
                            };
                            this.$nextTick(()=>{
                                this.fundChart5 = echarts.init(this.$refs.fundMoneyYear).setOption(fundMoneyYearChart);
                                this.fundChart6 = echarts.init(this.$refs.fundMoneyMonth).setOption(fundMoneyMonthChart);
                            })
                        }
                    }
                })
                //第四个图表
                apiHttp(api.GET_FUND_BALANCE).then(ret => {
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.fundBalance = ret.data;
                        let fundNameList = [];
                        let balanceItem = [];
                        let amountItem = [];
                        this.fundBalance.map(item => {
                            fundNameList.push(item.fundName)
                            balanceItem.push(item.balance)
                            amountItem.push(item.amountInvested)
                        })
                        let fundBalanceChart = {
                            title: {
                                text: '基金投资余额（万元）',
                                x: 'center',
                                textStyle: {
                                    color: '#666'
                                }
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            //图例
                            legend: {
                                data: ['已投金额','基金余额'],
                                bottom: 0
                            },
                            dataZoom: [{
                                start: 0,
                                end: 100,
                                bottom: 30
                            }, {
                                type: 'inside',
                            }],
                            toolbox: {
                                show: false,
                            },
                            //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                            calculable: true,
                            //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                            grid: [{left: '80',right: '80'}],
                            xAxis: [{
                                type: 'category',
                                data: fundNameList
                            }],
                            yAxis: [{
                                type: 'value',
                                axisTick: {
                                    show: false
                                }
                            }, ],
                            series: [
                                {
                                    name: '已投金额',
                                    type: 'bar',
                                    barWidth: 20, //柱图宽度
                                    stack: '基金',
                                    data: amountItem,
                                    itemStyle: {
                                        normal: {
                                            color: '#34C0E2'
                                        }
                                    }
                                }, {
                                    name: '基金余额',
                                    type: 'bar',
                                    barWidth: 20, //柱图宽度
                                    stack: '基金',
                                    data: balanceItem,
                                    itemStyle: {
                                        normal: {
                                            color: '#f62334'
                                        }
                                    }
                                }]
                        };
                        this.$nextTick(()=>{
                            if (this.fundBalance.length > 0) {
                                this.fundChart7 = echarts.init(this.$refs.fundBalance).setOption(fundBalanceChart);
                            }
                        })
                    }
                })
            },
            thighWholeProjectMet() {// 股权项目整体表现
                apiHttp(api.GET_HOLD_INVEST).then(ret =>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.thighWholeProject = ret.data;
                        let industryNameList = [];
                        let industryNumList = [];
                        let industryCountList = [];
                        this.industry.map (item => {
                              this.thighWholeProject.investIndustryCount.map( val=> {
                                  if (val.key === item.id) {
                                      industryNameList.push(item.name)
                                      industryNumList.push({
                                          value: val.value,
                                          name: item.name
                                      })
                                  }
                              })
                            this.thighWholeProject.investIndustryAmount.map(val=>{
                                if (val.key === item.id) {
                                    industryNameList.push(item.name)
                                    industryCountList.push({
                                        value: val.value,
                                        name: item.name
                                    })
                                }
                            })
                        })
                        //第一个表 年
                        let investInCountByYearDataX = [];
                        let investInCountByYearDataY = [];
                        this.thighWholeProject.investInCountByYear.map(item=>{
                            investInCountByYearDataX.push(item.key)
                            investInCountByYearDataY.push(item.value)
                        })
                        let investOutCountByYearDataY = [];
                        this.thighWholeProject.investOutCountByYear.map(item=>{
                            investOutCountByYearDataY.push(item.value)
                        })
                        //第一个表 月
                        let investInCountByMonthDataX = [];
                        let investInCountByMonthDataY = [];
                        this.thighWholeProject.investInCountByMonth.map(item=>{
                            investInCountByMonthDataX.push(item.key)
                            investInCountByMonthDataY.push(item.value)
                        })
                        let investOutCountByMonthDataY = [];
                        this.thighWholeProject.investOutCountByMonth.map(item=>{
                            investOutCountByMonthDataY.push(item.value)
                        })
                        //第二个表 年
                        let investInMoneyByYearDataX = [];
                        let investInMoneyByYearDataY = [];
                        this.thighWholeProject.investInAmountByYear.map(item=>{
                            investInMoneyByYearDataX.push(item.key)
                            investInMoneyByYearDataY.push(item.value)
                        })
                        let investOutMoneyByYearDataY = [];
                        this.thighWholeProject.investOutAmountByYear.map(item=>{
                            investOutMoneyByYearDataY.push(item.value)
                        })
                        //第二个表 月
                        let investInMoneyByMonthDataX = [];
                        let investInMoneyByMonthDataY = [];
                        this.thighWholeProject.investInAmountByMonth.map(item=>{
                            investInMoneyByMonthDataX.push(item.key)
                            investInMoneyByMonthDataY.push(item.value)
                        })
                        let investOutMoneyByMonthDataY = [];
                        this.thighWholeProject.investOutAmountByMonth.map(item=>{
                            investOutMoneyByMonthDataY.push(item.value)
                        })
                        let profitCountYear = {
                            title: {
                                text: '投资/退出项目数量',
                                x: 'center',
                                textStyle: {
                                    color: '#666'
                                }
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            //图例
                            legend: {
                                data: ['投资项目', '退出项目'],
                                bottom: 0
                            },
                            toolbox: {
                                show: false,
                            },
                            dataZoom: [{
                                start: 70,
                                end: 100,
                                bottom: 30
                            }, {
                                type: 'inside',
                            }],
                            //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                            calculable: true,
                            //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                            grid: [{left: '80',right: '80'}],
                            xAxis: [{
                                type: 'category',
                                data: investInCountByYearDataX
                            }],
                            yAxis: [{
                                type: 'value',
                                axisTick: {
                                    show: false
                                }
                            }, ],
                            series: [{
                                name: '投资项目',
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                data: investInCountByYearDataY,
                                itemStyle: {
                                    normal: {
                                        color: '#0180CD'
                                    }
                                }
                            }, {
                                name: '退出项目',
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                data: investOutCountByYearDataY,
                                itemStyle: {
                                    normal: {
                                        color: '#34C0E2'
                                    }
                                }
                            }]
                        };
                        let profitCountMonth = {
                            title: {
                                text: '投资/退出项目数量',
                                x: 'center',
                                textStyle: {
                                    color: '#666'
                                }
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            //图例
                            legend: {
                                data: ['投资项目', '退出项目'],
                                bottom: 0
                            },
                            toolbox: {
                                show: false,
                            },
                            dataZoom: [{
                                start: 70,
                                end: 100,
                                bottom: 30
                            }, {
                                type: 'inside',
                            }],
                            //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                            calculable: true,
                            //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                            grid: [{left: '80',right: '80'}],
                            xAxis: [{
                                type: 'category',
                                data: investInCountByMonthDataX
                            }],
                            yAxis: [{
                                type: 'value',
                                axisTick: {
                                    show: false
                                }
                            }, ],
                            series: [{
                                name: '投资项目',
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                data: investInCountByMonthDataY,
                                itemStyle: {
                                    normal: {
                                        color: '#0180CD'
                                    }
                                }
                            }, {
                                name: '退出项目',
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                data: investOutCountByMonthDataY,
                                itemStyle: {
                                    normal: {
                                        color: '#34C0E2'
                                    }
                                }
                            }]
                        };
                        let profitMoneyYear = {
                            title: {
                                text: '投资/退出项目金额（万元）',
                                x: 'center',
                                textStyle: {
                                    color: '#666'
                                }
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            //图例
                            legend: {
                                data: ['投资项目', '退出项目'],
                                bottom: 0
                            },
                            toolbox: {
                                show: false,
                            },
                            dataZoom: [{
                                start: 70,
                                end: 100,
                                bottom: 30
                            }, {
                                type: 'inside',
                            }],
                            //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                            calculable: true,
                            //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                            grid: [{left: '80',right: '80'}],
                            xAxis: [{
                                type: 'category',
                                data: investInMoneyByYearDataX
                            }],
                            yAxis: [{
                                type: 'value',
                                axisTick: {
                                    show: false
                                }
                            }, ],
                            series: [{
                                name: '投资项目',
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                data: investInMoneyByYearDataY,
                                itemStyle: {
                                    normal: {
                                        color: '#0180CD'
                                    }
                                }
                            }, {
                                name: '退出项目',
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                data: investOutMoneyByYearDataY,
                                itemStyle: {
                                    normal: {
                                        color: '#34C0E2'
                                    }
                                }
                            }]
                        };
                        let profitMoneyMonth = {
                            title: {
                                text: '投资/退出项目金额（万元）',
                                x: 'center',
                                textStyle: {
                                    color: '#666'
                                }
                            },
                            tooltip: {
                                trigger: 'axis',
                                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                                }
                            },
                            //图例
                            legend: {
                                data: ['投资项目', '退出项目'],
                                bottom: 0
                            },
                            toolbox: {
                                show: false,
                            },
                            dataZoom: [{
                                start: 70,
                                end: 100,
                                bottom: 30
                            }, {
                                type: 'inside',
                            }],
                            //是否显示拖拽用的手柄（手柄能拖拽调整选中范围）。
                            calculable: true,
                            //直角坐标系 grid 中的 x 轴，单个 grid 组件最多只能放上下两个 x 轴。
                            grid: [{left: '80',right: '80'}],
                            xAxis: [{
                                type: 'category',
                                data: investInMoneyByMonthDataX
                            }],
                            yAxis: [{
                                type: 'value',
                                axisTick: {
                                    show: false
                                }
                            }, ],
                            series: [{
                                name: '投资项目',
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                data: investInMoneyByMonthDataY,
                                itemStyle: {
                                    normal: {
                                        color: '#0180CD'
                                    }
                                }
                            }, {
                                name: '退出项目',
                                type: 'bar',
                                barWidth: 20, //柱图宽度
                                data: investOutMoneyByMonthDataY,
                                itemStyle: {
                                    normal: {
                                        color: '#34C0E2'
                                    }
                                }
                            }]
                        };
                        //饼图
                        let thightProfitLeft = {
                            title: { //头部标题
                                text: '投资项目数量行业分布',
                                x: 'center',
                                textStyle: {
                                    color: '#8B8B7A'
                                }
                            },
                            legend: {
                                data: industryNameList,
                                bottom: 6, //调图例距离底部的距离
                                left: 'center', //调图例距离右边部的距离
                                //orient: 'vertical' //图例排列方式
                            },
                            series: [{
                                type: 'pie', //图标样式为饼图
                                radius: '62%', //整个饼图的大小
                                center: ['50%', '50%'], //饼图的位置
                                label: {
                                    normal: {
                                        formatter: function (obj) {
                                            //return obj.name + '\n' + obj.percent + '%'
                                            return obj.percent + '%' //内部只显示百分比
                                        },
                                         //position: 'inside' //显示数据在内部
                                    }
                                },
                                data: industryNumList
                            }],

                            color: ['#3AB2FF', '#9F5BA4', '#E7541D', '#CC4117', '#FCB42F', '#0DC741', '#006378'] //各个饼图的颜色
                        };
                        let thightProfitRight = {
                            title: { //头部标题
                                text: '投资项目金额行业分布',
                                x: 'center',
                                textStyle: {
                                    color: '#8B8B7A'
                                }
                            },
                            legend: {
                                data: industryNameList, //最下面分类
                                bottom: 6, //调图例距离底部的距离
                                left: 'center', //调图例距离右边部的距离
                                //orient: 'vertical' //图例排列方式
                            },
                            series: [{
                                type: 'pie', //图标样式为饼图
                                radius: '62%', //整个饼图的大小
                                center: ['50%', '50%'], //饼图的位置
                                //radius: ['36%', '64%'], //传数组实现环形图，[内半径，外半径]
                                label: {
                                    normal: {
                                        formatter: function (obj) {
                                            return obj.percent + '%' //内部只显示百分比
                                        },
                                        //position: 'inside' //显示数据在内部
                                    }
                                },
                                data: industryCountList
                            }],
                            color: ['#3AB2FF', '#9F5BA4', '#E7541D', '#CC4117', '#FCB42F', '#0DC741', '#006378'] //各个饼图的颜色
                        };
                        //累计投资的项目个数
                        this.$nextTick(()=>{
                            this.thightChart = echarts.init(this.$refs.profitCountYear).setOption(profitCountYear);
                            //退出项目个数
                            this.thightChart2 = echarts.init(this.$refs.profitCountMonth).setOption(profitCountMonth);
//                        //投资的金额
                            this.thightChart3 = echarts.init(this.$refs.profitMoneyYear).setOption(profitMoneyYear);
//                        //退出的金额
                            this.thightChart4 = echarts.init(this.$refs.profitMoneyMonth).setOption(profitMoneyMonth);
                            //饼图
                            this.thightChart5 = echarts.init(this.$refs.thightProfitLeft).setOption(thightProfitLeft);
                            this.thightChart6 = echarts.init(this.$refs.thightProfitRight).setOption(thightProfitRight);
                        })
                    }
                })
            },
            //基金整体表获取年
            wholeFund(index) {
                if (index === 0) {
                    this.wholeFundTabIndex = 0
                } else if (index === 1) {
                    this.wholeFundTabIndex = 1
                } else if (index === 2) {
                    this.wholeFundTabIndex = 2
                } else if (index === 3) {
                    this.wholeFundTabIndex = 3
                } else if (index === 4) {
                    this.wholeFundTabIndex = 4//选项卡停留在父级
                } else if (index === 5) {
                    this.wholeFundTabIndex = 5//选项卡停留在父级
                } else {
                    this.wholeFundTabIndex = 6//选项卡停留在父级
                }
            },
            //股权项目整体表现
            equityProject(index) {
                if (index === 0) {
                    this.equityProjectTabIndex = 0
                } else if (index === 1) {
                    this.equityProjectTabIndex = 1
                } else if (index === 2) {
                    this.equityProjectTabIndex = 2
                } else if (index === 3) {
                    this.equityProjectTabIndex = 3
                } else {
                    this.equityProjectTabIndex = 4
                }
            },
            personalCenter(index) {//点击我的任务，我的审批跳转个人中心
                if (index === 0) {
                    this.$router.push({name: 'personal-center',params: {tabIndex: '0'}})
                } else if (index === 1) { // 待我审批
                    this.$router.push({name: 'personal-center',params: {tabIndex: '1', tab: '1'}})
                } else if (index === 2) { // 我发起的
                    this.$router.push({name: 'personal-center',params: {tabIndex: '1', tab: '2'}})
                }
            },
            preInvestment() {
                this.$router.push({name: 'pre-investment-project-list'})
            }
        },
        components: {
            //'csRedDot': require('__components/red-dot'),  //小红点
        }
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
    .index-box-01{border:#dbe3ea 1px solid;padding:20px 20px;}
    .index-box-01 h3{font-size:18px;font-weight: normal;padding-bottom:5px}
    .line-30{line-height: 30px;}
    .line-30 span{color:#1a85e1;font-size:24px;}
    .line-30 span.s_01{color:#ff6c60}
    .line-30 i{padding-right:10px;color:#666666}
    .index-tab-title-01{background:#edf5fc;height:74px;margin-top:5px;border:#dbe3ea 1px solid}
    .index-tab-title-01 ul li{float:left;width:25%;padding-top:10px; text-align: center; cursor: pointer;border-right:#dbe3ea 1px solid;height:73px;font-size:14px;color:#666666}
    .index-tab-title-01 ul li span{ display: block;font-size:24px;}
    .index-tab-title-01 ul li.on{background:#fff;border-top:#3e9dec 3px solid; height: 74px;top:-1px; position: relative;}
    .index-tab-title-01 ul li.on span{color:#1a85e1;}
    .index-tab-box-01{border:#dbe3ea 1px solid;border-top:none;padding:20px;}
    .index_div_01{}
    .e-btn{overflow: hidden;padding-left:80px}
    .e-btn a.btn{display: inline-block;font-size: 14px;background-color: #c7d4dc;width: 44px;height: 24px;line-height: 24px;text-align: center;color: #fff;cursor: pointer;overflow:hidden;float:left}
    .e-btn a.on{background: #5c5b5b}
    .index-tab-title-02 ul li{width:33%}
    .index-tab-title-02 ul li.on{width:34%}
    .span-cursor{ cursor: pointer;color: #0081cd}
    .index-echarts{width:100%;height:300px}
    .index-left{float:left;width:50%;height:300px;}
    .echarts-h-0{height:0px;overflow:hidden}
    .div-Por{height:1px;}
    .div-Por div{height:250px;}
    .div-on{height:300px;width:100%}
    .index-tab-border-top{border-top:#dbe3ea 1px solid}
    .ca-color-index-blue{color:#1a85e1}
    .ca-font-size-16{font-size:16px;}
    .ca-font-size-18{font-size:18px;}
    /****投前动态布局****/
    .ca-bef-bxo{/*height:220px;*/overflow:hidden; position: relative;margin-left:75px;}
    .ca-bef-bg{ /*background: #f4f4f4;*/ background:url('../../assets/images/pre_cast_bg.gif') ;background-size:100% 100%;height:120px; position: absolute;width:100%;top:40px; z-index: 0;

    }
    .ca-bef-rigth{z-index: 2; position: relative;}
    .ca_width_percent_20{width:14%;float: left; }
    .ca-bef-con{color:#fff;height:243px;
        background:url('../../assets/images/pre_cast_01.gif') no-repeat top center;overflow: hidden;width:100%;
    }
    .ca-bef-con_00{
        background:url('../../assets/images/pre_cast_01.gif') no-repeat top center;}
    .ca-bef-con_01{background:url('../../assets/images/pre_cast_02.gif') no-repeat top center;}
    .ca-bef-con_02{background:url('../../assets/images/pre_cast_03.gif') no-repeat top center;}
    .ca-bef-con_03{background:url('../../assets/images/pre_cast_04.gif') no-repeat top center;}
    .ca-bef-con_04{background:url('../../assets/images/pre_cast_05.gif') no-repeat top center;}
    .ca-bef-con_05{background:url('../../assets/images/pre_cast_05.gif') no-repeat top center;}
    .ca-bef-con_06{background:url('../../assets/images/pre_cast_05.gif') no-repeat top center;}
    .ca_width_percent_60{text-align: center;line-height:50px;margin-top:41px;font-size:30px;}
    .ca-bef-con_04 .ca_width_percent_60{line-height: 45px;margin-top:45px;}
    .ca-bef-left{width:75px;font-size:20px;float:left; line-height: 70px; padding-top:35px; text-align: center}
    .ca-bef-center{font-size:14px; text-align: center; margin-top: 15px;}
    .bef-border{height:1px; border-bottom:#a1aaaf 1px dashed; position: absolute;top:240px; z-index: 1 ;width:100%}
    .ca-title h3{font-weight: normal;font-size:18px;color:#333333}
    .color-gray{color:#666666}
    .ca-font-size-22{font-size:22px;}
    .ca-font-size-14{fotns-zie:14px;margin-left:8px;}
</style>
